<template>
    <div>
        <el-card shadow="hover" :body-style="{padding: '0px'}">
            <div class="card-box clearfix">
                <i class="box-title-icon fontColor" :class="newsContent.icon"></i>
                <template>
                    <el-tabs v-model="activeName" @tab-click="handleNewsClick">
                        <el-tab-pane :label="newsContent.name" name="first">
                            <div class="tabs-content-box">
                                <el-table :data="newsList" :show-header="false" style="width: 100%;font-size:14px;">
                                    <el-table-column width="40">
                                        <template slot-scope="scope">
                                            <div class="todo-tag" v-bind:class="'todo-tag-'+(scope.$index+1)">{{scope.$index+1}}</div>
                                        </template>
                                    </el-table-column>
                                    <el-table-column show-overflow-tooltip>
                                        <template slot-scope="scope">
                                            <div class="todo-item">
                                                <a href="#" title="" @click="openMenuFunction2(scope.row.url)">{{scope.row.title}}</a>
                                            </div>
                                        </template>
                                    </el-table-column>
                                    <!--<el-table-column width="80">
                                        <template slot-scope="scope">
                                            <div class="todo-name">{{scope.row.original}}</div>
                                        </template>
                                    </el-table-column>-->
                                    <el-table-column width="102">
                                        <template slot-scope="scope">
                                            <div class="todo-date">{{scope.row["start_publication"]}}</div>
                                        </template>
                                    </el-table-column>
                                </el-table>
                            </div>
                        </el-tab-pane>
                    </el-tabs>
                </template>
                <el-button class="btn-more" type="text" >
                    <a href="javascript:void(0);" @click="handleNewsMore" class="fontColor">MORE</a>
                </el-button>
            </div>
        </el-card>
    </div>
</template>

<script>
import { newsContent } from './data/Content.js';
// import bus from '../../common/bus';
import { formatDate } from '~/assets/utils/date.js';
export default {
    name: 'NewsList',

    data() {
        return {
            activeName: 'first',
            //newsList: require("./data/NewsData.json"),
            newsList:[],
            newsContent: newsContent
        };
    },
    created:function (){
        this.getList();
    },
    methods: {
        getList(){
            console.log(newsContent);
            this.$axios.get(newsContent.newsUrl)
                .then(res => {
                    this.newsList = res.data.map( item => {
                        item['start_publication'] = formatDate(item['start_publication'], 'yyyy-MM-dd');
                        return item;
                    });
                });
        },
        //openMenuFunction(id,title){
        //console.log(url,title);
        // bus.$emit('openMenu',' http://198.16.192.36/api2/news/detail/'+id+'/',title);
        //},
        openMenuFunction2(url){
            window.open(url, '_blank');
        },
        handleNewsClick() {
            //console.log(tab, event);
        },
        handleNewsMore(){
            // let menu = {
            //     url:newsContent.moreUrl,
            //     name:newsContent.name,
            // };
            // bus.$emit('openMenu',menu);
            let obj=window.open(newsContent.moreUrl);

            obj.document.title=newsContent.name;
        }
    }
};
</script>
